<!--Copyright https://gitee.com/laiyw/monitor-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Server Monitor Server</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf8"/>
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css"/>
</head>
<body>
<div class="container">
    <table id="serverInfoTable" class="table table-hover">
        <tr>
            <td width="15%">服务器名称</td>
            <td width="30%"></td>
            <td width="15%">操作系统</td>
            <td></td>
        </tr>
        <tr>
            <td>系统架构</td>
            <td></td>
            <td>版本</td>
            <td></td>
        </tr>
        <tr>
            <td>处理器数</td>
            <td></td>
            <td>系统负载平均值</td>
            <td></td>
        </tr>
        <tr>
            <td>服务器IP</td>
            <td colspan="3"></td>
        </tr>
    </table>
</div>
<script src="js/jquery.min.js" type="text/javascript" charset="utf8"></script>
<script src="bootstrap/js/bootstrap.min.js" type="text/javascript" charset="utf8"></script>
<script src="js/echarts.min.js" type="text/javascript" charset="UTF-8"></script>
<script src="js/common.js" type="text/javascript" charset="utf8"></script>

<script type="text/javascript">
    $.namespace("monitor.server");
    monitor.server = function () {
        return {
            init: function () {
                monitor.common.buildHeadAndInitInterval(1, this.ajax);
            },
            ajax: function () {
                $.ajax({
                    type: 'POST',
                    url: 'server.json',
                    dataType: "json",
                    success: function (data) {
                        monitor.server.serverInfo(data);
                    }
                });
            },
            serverInfo: function (data) {
                var table = $("#serverInfoTable");
                table.find("tr:eq(0)").find("td:eq(1)").text(data.hostName);
                table.find("tr:eq(0)").find("td:eq(3)").text(data.name);

                table.find("tr:eq(1)").find("td:eq(1)").text(data.arch);
                table.find("tr:eq(1)").find("td:eq(3)").text(data.version);

                table.find("tr:eq(2)").find("td:eq(1)").text(data.availableProcessors);
                table.find("tr:eq(2)").find("td:eq(3)").text(data.systemLoadAverage);

                table.find("tr:eq(3)").find("td:eq(1)").text(data.address);
            }
        }
    }();

    $(document).ready(function () {
        monitor.server.init();
    });
</script>
</body>
</html>